<%@ page language="java" pageEncoding="UTF-8"%>
<%@ include file="/common/taglibs.jsp"%>
<%@ taglib uri="http://v1.com/pn" prefix="v1" %>
<title>${category.name}| 北京时间</title>
<script src='${baseurl}dwr/interface/dwrAction.js'></script>
<script src='${baseurl}dwr/engine.js'></script>
<script src='${baseurl}dwr/util.js'></script>

<script type="text/javascript">
	/* jquery开始 */
	$(document).ready(function(){ 
	
		/* 缩略图墙开始 */	
				var $thumbs_img = $('#thumbs_img');
 				$thumbs_img.imagesLoaded( function(){
 					 $thumbs_img.masonry({
    					itemSelector : '.box',
    					columnWidth: 90,
    					isAnimated: true })
 					});
 					
                var $thumbs_other = $('#thumbs_other');					 
 				$thumbs_other.imagesLoaded( function(){
 					 $thumbs_other.masonry({
    					itemSelector : '.box',
    			    	columnWidth: 90,
    					isAnimated: true })
 		 			});

    	/* 缩略图墙结束 */
	});
	/* jquery结束 */



function show(itemid){
	 location.href='./category.html?categoryid=${category.categoryid}&itemid='+itemid;
}

function good(){
	var f = new Object();
	f.itemid=${item.itemid};
	f.categoryid=${category.categoryid};
	dwrAction.good(f,function (result){
		/* DWRUtil.setValue("score_img", result.score); */
		document.getElementById("score_img").innerHTML=result.score;
		});
}

function addTag(){
	var v = document.getElementById("newtag").value;
	if(isEmpty(v)||v=="您的描述。。。"){
		return;
	}
	var f = new Object();
	f.itemid=${item.itemid};
	f.categoryid=${item.categoryid};
	f.tag=v;
	dwrAction.addTag(f,function (newtag){
		var html =document.getElementById("tags").innerHTML;
		document.getElementById("tags").innerHTML=html+
		"<a href=\"tag.html?tag=\" onclick=\"encodeZH(this)\">"+newtag.tag+"</a>";
		});
}

	$(".video").fancybox({
	    'padding'           : 0,
        'autoScale'     	: false,
        'transitionIn'		: 'none',
		'transitionOut'		: 'none'
	});
</script>
<body>
		
<div id="content">
<h2>${category.name}</h2><h4>${category.digest}</h4><!-- 专辑标题 -->
<div id="col_left"><!-- 左边column -->
<div class="full_img" align="center">
<!-- <span id="play_slide">播放幻灯片</span> -->
<a href="slideshow.html?categoryid=${category.categoryid}&itemid=${item.itemid}" target="_blank">
<img align="middle" src="${item.url}" id="img"  >
</a>
<c:if test="${not empty item.digest}">
<div class="caption">
	<span id="cont">${item.digest}</span>
</div>
</c:if>
<div class="full_bloc">
<span id="score_img">${item.score}</span><img src="${baseurl}resource/imgs/love.png" width="15"/>&nbsp;&nbsp;
<a href="#score" onclick="good()">喜欢+</a>&nbsp;&nbsp;&nbsp;&nbsp;
<span><a href="slideshow.html?categoryid=${category.categoryid}&itemid=${item.itemid}" target="_blank">播放幻灯片</a></span>&nbsp;&nbsp;&nbsp;&nbsp;
<input type="text" name="search_query" id="newtag"
                   size="15" 
                   value="您的描述。。。"
                   onfocus="javascript:if(this.value=='您的描述。。。')this.value='';" 
                   onblur="javascript:if(this.value=='')this.value='您的描述。。。';"
                   value="" 
                   autocomplete="off" /><a href="#tag" onclick="addTag()">添加标签</a>
</div>
<div class="full_bloc" style="border-top:1px solid #ccc; float:left;clear:both;" id="tags">
<span>标签: </span>
<c:if test="${not empty tags}">
<c:forEach items="${tags}" var="tag">
<a href="tag.html?tag=" onclick="encodeZH(this)"><c:out value="${tag.tag}" /></a>
</c:forEach>
</c:if>
</div>

 <div class="share">

<div class="clear"></div>

</div>

</div>

<c:import url="/common/comment.jsp"></c:import>
</div>

<div id="col_right"><!-- 右边column -->
	<div id="thumbs_img" class="clearfix" ><!-- 缩略图墙 -->
		<c:forEach items="${items}" var="it" varStatus="s">
			<div class="box col1" style="cursor: pointer">
					<p class="thumbs"><img src="${it.thumb}" onclick="show(${it.itemid})"></p>
					<c:if test="${not empty it.digest}">
						<c:out value="${fn:substring(it.digest, 0, 10)}" /><c:out value="${fn:length(it.digest)>10?'...':''}" />
					</c:if>
					<h4><c:if test="${not empty it.name}">
						${it.name}
					</c:if></h4>
			</div>
		</c:forEach>
	</div>
	<c:import url="/common/interest.jsp"></c:import>
	<div class="clear"></div>
</div>
<div class="clear"></div>
</div>
<div class="clear"></div>
</body>




